Ext.define('DragonApp.view.base.DAUChart', {
    extend: 'Ext.chart.CartesianChart',

    xtype: 'base-dau-chart',

    requires: [
        'Ext.chart.axis.Axis',
        'Ext.chart.axis.Numeric',
        'Ext.chart.axis.Numeric3D',
        'Ext.chart.axis.Category3D',
        'Ext.chart.grid.HorizontalGrid3D',
        'Ext.chart.axis.Category',
        'Ext.chart.series.Bar3D',
        'Ext.chart.series.Bar'
    ],
    config: {
        data_field: null,
        data_color: [
            '#6E548D',
            '#94AE0A',
            '#3D96AE'
        ]
    },

    controller: 'base-chart',
    reference: 'chart',

    width: '100%',

    height: 500,

    animation: {
        duration: 200
    },
    store: {
        type: 'jsonPBaseStore'
    },
    innerPadding: {
        left: 20,
        right: 20
    },/*
    legend: {
        docked: 'top'
    },*/
    axes: [{
        type: 'numeric3d',
        position: 'left',
        grid: true,
        minimum: 0,
        title: {
            text: '用户人数',
            fontSize: 15,
            color: '#666'
        },
        grid: {
            odd: {
                opacity: 1,
                fill: '#eee',
                stroke: '#eee',
                'lineWidth': 0
            }
        },
        fields: 'DAU',
        increment: 2000
    }, {
        type: 'category3d',
        position: 'bottom',
        title: {
            text: '查询日期',
            fontSize: 15,
            color: '#666'
        },
        fields: 'date',
        label: {
            rotate: {
                degrees: 45
            }
        }
    }],
    series: {
        type: 'bar3d',
        xField: 'date',
        yField: 'DAU',
        stacked: false,
        subStyle: {
            fill: ['#9393FF'] //'#66B3FF','#66B3FF','#80FFFF'
        },
        label: {
            field: 'DAU',
            display: 'insideEnd',
            renderer: 'onSeriesLabelRender'
        }
    }
});